<template>
  <div>
      <h1>姓名：{{info.name}}</h1>
      <h2>年龄：{{info.age}}</h2>
      <h2>兴趣：{{info.interest}}</h2>
  </div>
</template>
<script>
  import axios from 'axios';
  export default{
    data(){
      return{
          name:'hello,world'
      }
    },
    // myjson.com
    // asyncData(){
    //   return axios.get('https://api.myjson.com/bins/1br6ti').then((res)=>{
    //     console.log(res);
    //     return {info:res.data}
    //   })
    // }

    /**
     * ansycData的await方法
      当然上面的方法稍显过时，现在都在用ansyc…await来解决异步,改写上面的代码。
     */

    async asyncData(){
      let {data}=await axios.get('https://api.myjson.com/bins/1br6ti')
      console.log(data);
      return {info:data}
    }
  }
</script>
